<template>
  <div>
   <p>{{ total }}</p>
  </div>
</template>

<script>
// 计算属性：只要依赖发生变化，计算属性会重新计算
// 用法： 用法与 data 中数据变量用法完全一直(配合在插值或配合指令)
// 计算属性不能和data中的数据变量重名
// 优势： 带缓存
// 1.依赖不变，多次调用同一个计算属性，会从缓存中去出结果
// 2.依赖变了，会重新执行计算属性，并缓存新的结果
export default {
 data () {
  return {
   boy:20,
   girl:20
  }
 },
 // 计算属性
 computed: {
  total() {
   return this.boy + this.girl
  }
 }
}
</script>

<style>

</style>